import type { FormInstance, FormRules } from "element-plus";
import { reactive, ref } from "vue";

/**
 * @description 配置项
 */
export const headerConfig = [
  {
    type: "input",
    // title: "员工名称",
    value: "name",
    clearable: true,
    placeholder: "请输入员工名称",
  },
  {
    type: "input",
    // title: "员工名称",
    value: "deptName",
    clearable: true,
    placeholder: "请输入部门名称",
  },
];

/**
 * @description 搜索数据
 */
export const configData = ref({
  name: "",
  deptName: "",
});

/**
 * @description 表格配置
 */
export const tableConfig = [
  {
    prop: "id",
    label: "员工编号",
    width: "100",
  },
  {
    prop: "name",
    label: "员工名称",
    width: "100",
  },
  {
    prop: "username",
    label: "账号",
    width: "100",
  },
  {
    prop: "password",
    label: "密码",
    type: "password",
    // width: "150",
  },
  {
    prop: "email",
    label: "邮箱",
    // width: "150",
  },
  {
    prop: "age",
    label: "年龄",
    width: "100",
  },
  {
    prop: "deptName",
    label: "所属部门",
    // width: "150",
  },
  {
    prop: "admin",
    label: "是否为管理员",
    width: "110",
    type: "switch",
  },
];

/**
 * @description 表格操作项
 */
export const tableOptionList = [
  { type: "success", name: "编辑", option: "edit" , permission: "employee:saveOrUpdate" },
  { type: "danger", name: "删除", option: "delete" , permission: "employee:delete" },
];

/**
 * @description 表格数据
 */
export const tableList = ref([]);

/**
 * @description 添加数据表单实例
 */
export const addDataRef = ref<FormInstance>();

/**
 * @description 添加数据表单规则
 */
export const addDataRules = reactive<FormRules>({
  name: [{ required: true, message: "请输入员工名称", trigger: "blur" }],
  username: [{ required: true, message: "请输入账号", trigger: "blur" }],
  password: [{ required: true, message: "请输入密码", trigger: "blur" }],
  email: [{ required: true, message: "请输入邮箱", trigger: "blur" }],
  age: [{ required: true, message: "请输入年龄", trigger: "blur" }],
  departmentId: [{ required: true, message: "请输入选择部门", trigger: "blur" }],
  roleId: [{ required: true, message: "请输入选择角色", trigger: "blur" }],
});

/**
 * @description 可选权限列表
 */
export const roleValue = ref();

/**
 * @description 已选权限列表
 */
export const roleList = ref();
